// // PivotSheet.tsx
// import React, { useEffect, useRef, useState } from "react";
// import {
//     PivotSheet,
//     type S2DataConfig,
//     type S2Options,
//     type ThemeName,
// } from "@antv/s2";
// import '@antv/s2/esm/styles';
// import { CommonProps, ExportCfg } from "../@types";

// interface Props extends CommonProps {
//     exportCfg?: ExportCfg;
// }

// export default function PivotSheetReact(props: Props) {
//     const {
//         dataCfg,
//         options = {},
//         adaptive = true,
//         theme = "default",
//         className,
//         style,
//         exportCfg,
//     } = props;
//     const containerRef = useRef<HTMLDivElement>(null);
//     const sheetRef = useRef<PivotSheet | null>(null);
//     const [curTheme, setCurTheme] = useState<ThemeName>(theme);

//     /* 生命周期同 TableSheet，只是把类换成 PivotSheet */
//     useEffect(() => {
//         if (!containerRef.current) return;
//         sheetRef.current = new PivotSheet(containerRef.current, dataCfg, {
//             ...options,
//             width: containerRef.current.clientWidth,
//             height: containerRef.current.clientHeight,
//         });
//         sheetRef.current.setTheme(curTheme);
//         sheetRef.current.render();
//         return () => sheetRef.current?.destroy();
//     }, []);

//     useEffect(() => {
//         if (!sheetRef.current) return;
//         sheetRef.current.setDataCfg(dataCfg);
//         sheetRef.current.setOptions(options);
//         sheetRef.current.render(false);
//     }, [dataCfg, options]);

//     useEffect(() => {
//         sheetRef.current?.setTheme(curTheme);
//         sheetRef.current?.render(false);
//     }, [curTheme]);

//     useEffect(() => {
//         if (!adaptive) return;
//         const ro = new ResizeObserver(() => {
//             if (!containerRef.current || !sheetRef.current) return;
//             const { clientWidth, clientHeight } = containerRef.current;
//             sheetRef.current.changeSize(clientWidth, clientHeight);
//             sheetRef.current.render(false);
//         });
//         ro.observe(containerRef.current!);
//         return () => ro.disconnect();
//     }, [adaptive]);

//     const onExport = (type: "csv" | "xlsx") => {
//         const filename = `${exportCfg?.filename || "pivot"}.${type}`;
//         if (type === "csv") sheetRef.current?.downloadCsv(filename);
//         else sheetRef.current?.downloadData(filename);
//     };
//     const onCopy = () => sheetRef.current?.copyData();

//     return (
//         <div
//             className={className}
//             style={{ display: "flex", flexDirection: "column", ...style }}
//         >
//             <div style={{ marginBottom: 8, display: "flex", gap: 8 }}>
//                 <button
//                     onClick={() =>
//                         setCurTheme(curTheme === "default" ? "dark" : "default")
//                     }
//                 >
//                     主题:{curTheme}
//                 </button>
//                 <button onClick={onCopy}>复制</button>
//                 {exportCfg?.open !== false && (
//                     <>
//                         <button onClick={() => onExport("csv")}>导出CSV</button>
//                         <button onClick={() => onExport("xlsx")}>
//                             导出Excel
//                         </button>
//                     </>
//                 )}
//             </div>
//             <div ref={containerRef} style={{ flex: 1, minHeight: 200 }} />
//         </div>
//     );
// }
